<template>
	<view class="">
		<!-- #ifdef MP-WEIXIN -->
		<u-navbar title=" " :background="{ background: '#f8f8f8' }">
			<view class="slot-wrap">
				<u-search
					:focus="true"
					@custom="clickCancel"
					placeholder="搜索..."
					shape="square"
					:action-style="{ color: '#007aff' }"
					action-text="取消"
					:bg-color="'#ffffff'"
					v-model="search_word"
				></u-search>
			</view>
		</u-navbar>
		<!-- #endif -->
		<!-- #ifndef MP-WEIXIN -->
		<view class="status_bar"></view>
		<view class="content_search">
			<u-search
				:focus="true"
				@custom="clickCancel"
				placeholder="请输入用户名或账号"
				shape="square"
				:action-style="{ color: '#007aff' }"
				action-text="取消"
				:bg-color="'#ffffff'"
				v-model="search_word"
			></u-search>
		</view>
		<!-- #endif -->
		<view class="content">
			<view v-for="user in searchList" :key="user.userId" class="list-cell" @tap="linkToCard(user)"
			 hover-class="message-hover-class">
				<image mode="widthFix" :src="user.headImg?user.headImg:'/static/qq.png'" />
				<view class="list-cell-name">{{user.userName}}({{user.wechatNumber}})</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			search_word: '',
			searchList:[],
			type:false
		};
	},
	newname(str){
		
	},
	watch:{
		search_word(){
			if(!this.search_word){
				this.searchList = [];
				return;
			};
			this.getlist();
		}
	},
	methods: {
		clickCancel() {
			this.$u.route({
				type: 'navigateBack'
			});
		},
		linkToCard(obj) {
			// console.log(obj.headImg)
			var isf = this.firendList.filter(item => item.userId == obj.userId);
			if(isf && isf.length){
				this.$u.route({
					url: 'pages/businessCard/businessCard',
					params: isf[0]
				})
				return;
			};
			if(obj.userId == this._user_info.userId){
				uni.showToast({
					title: '这是当前登录用户!',
					icon: 'none',
					duration: 1500
				});
				return;
			};
			this.$u.route({
				url: 'pages/chat/yanzheng',
				params: obj
			})
		},
		getlist(){
			var _this = this;
			uni.request({
				url: this.$store.state.url + '/getsolist',
				method: 'POST',
				data: {
					str: this.search_word
				},
				success: res => {
					if(res.data.code == 200){
						_this.searchList = res.data.lst;
						console.log(res.data.lst)
					}
				}
			})
		}
	},
	onShow() {
		// this.getlist()
		// console.log(this.$u.route)
	},
	onLoad(e) {
		// if(e.type){
		// 	this.type = e.type;
		// }else{
		// 	this.type = false;
		// }
	}
};
</script>

<style lang="scss" scoped>
.status_bar {
	height: var(--status-bar-height);
	width: 100%;
}
.content_search {
	padding: 16rpx;
	background-color: #f8f8f8;
}
.content {
		height: 100%;

		.list-cell {
			display: flex;
			box-sizing: border-box;
			width: 100%;
			padding: 10px 24rpx;
			overflow: hidden;
			color: #323233;
			font-size: 28rpx;
			line-height: 48rpx;
			background-color: #fff;
			align-items: center;

			uni-image {
				width: 76rpx;
				height: 76rpx;
				border-radius: 12rpx;
				flex: 0 0 76rpx;
			}

			&-name {
				padding-left: 20rpx;
			}
		}
	}
</style>
